<script setup>
import { reactive, ref, watch, watchEffect } from "vue";

const tip = ref("偶数");
const n = ref(20);

// const stop = watch(n, (newVal) => (newVal % 2 === 0 ? (tip.value = "偶数") : (tip.value = "奇数")));

// 立即执行，不需要手动添加监听对象，无法获取到修改前后的值
watchEffect(() => {
  console.log(tip.value);
  console.log(n.value);
});
function change() {
  n.value++;
  if (n.value >= 25) {
    stop();
  }
}
</script>

<template>
  <div>
    <div>年龄: {{ n }}</div>
    <div>提示: {{ tip }}</div>
    <button @click="change">click</button>
  </div>
</template>

<style scoped></style>
